<template>
	<view >
		<view class="w343" v-for="item in 8">
			<view class="w90 fs14">
				<text class="fs12" style="color: #B1B1B1;">2020-01-26 12:26</text>
				<!-- 判断是否发货 -->
				<h5 v-if="" style="position: absolute;right: 60rpx;top: 50rpx;" class="wzf">待发货</h5>
				<!-- 判断是否收货 -->
				<!-- <h5 style="position: absolute;right: 60rpx;top: 50rpx;" class="wzf">待收货</h5> -->
				<!-- 没问题 已完成 -->
				<!-- <h5 style="position: absolute;right: 60rpx;top: 50rpx;" class="wzf">已完成</h5> -->
			</view>
			<view class="w90" style="padding-bottom: 32rpx;border-bottom: 1rpx solid rgba(243,243,243,1);">
				<!-- 根据数据 循环 -->
				<view style="display: flex;" v-for="item in 2">
					<image src="../../../static/22.png"></image>
					<view style="margin-left: 30rpx;width: 70%;position: relative;">
						<view class="fs13" style="position: relative;">
							<text>赣南脐橙</text>
							<text style="position: absolute;right: 0;">￥8.8</text>
						</view>
						<text class="Ptc fs11">规格: 2斤</text><br>
						<text class="Ptc fs12">×2</text>
					</view>
				</view>
			</view>
			<view class="w90" style=";line-height: 60rpx;position: relative;">
				<text class="fs12">总计 :</text>
				<text class="fs12" style="color: rgba(254,64,30,1);">￥</text>
				<text class="fs17" style="color: rgba(254,64,30,1);font-weight: 700;">199.80</text>
				<!-- 没有发货 -->
				<view class="fs13 examine" style="right: 25%;">平台配送</view>
				<view class="fs13 examine" style="right: 0%;">自配送</view>
				<!-- 已发货货 -->
				<!-- <view class="fs13 examine" style="right: 0%;">查看轨迹</view> -->
				<!-- 退货 -->
				<!-- <br> <text class="fs12">退款理由：<text>什么什么什么什么</text></text>
				<view style="height: 64rpx;position: relative;">
					<text class="tk fs12" style="width: 30%; color: #20B47A;">拒绝</text>
					<text class="tk fs12" style="width: 60%;right: 0;background: linear-gradient(150deg,#2ed993 9%, #20b47a 100%);">同意退款</text>
				</view> -->
			</view>
		</view>
		<!-- 自定义tabbar高度 -->
		<view style="height: 300rpx;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
.w343 {
		width: 686rpx;
		margin: 50rpx auto;
		background: #FFFFFF;
		position: relative;
		padding: 20rpx;
	}

	.w90 {
		width: 100%;
		margin: 0 auto;
		padding-top: 28rpx;
	}

	.w90>view>image {
		width: 108rpx;
		height: 108rpx;
	}
.tk{
	height: 64rpx;
	line-height: 64rpx;
	text-align: center;
	color: #FFFFFF;
	border: 1rpx solid #2ED993;
	border-radius: 6rpx;
	position: absolute;
}
	.Ptc {
		color: rgba(184, 184, 184, 1);
	}

	.examine {
		line-height: 29rpx;
		padding: 8rpx 20rpx;
		color: #24BC81;
		border: 1rpx solid #24BC81;
		border-radius: 18rpx;
		position: absolute;
		top: 30rpx;
	}
	.wzf{
		color: #333333;
	}
</style>
